const NODE_COLOR = '#9932CC'
export default function registerJudge(lf) {
  lf.register('custom-judge', ({ PolygonNode, PolygonNodeModel, h }) => {
    class Node extends PolygonNode {

      getIconShape() {
        return h(
          'text',
          {
            x: 0,
            y: 30,
            width: 10,
            height: 23,
            fontSize: 10,
            viewBox: '0 0 1024 1024'
          },
          ''
        )
      }
      getShape() {
        const { model } = this.props
        const { width, height, x, y, points } = model
        const {
          fill,
          fillOpacity,
          strokeWidth,
          stroke,
          strokeOpacity,
        } = model.getNodeStyle()
        const transform = `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`
        const pointsPath = points.map(point => point.join(',')).join(' ')
        return h(
          'g',
          {
            transform
          },
          [
            h(
              'polygon',
              {
                points: pointsPath,
                fill,
                stroke,
                strokeWidth,
                strokeOpacity,
                fillOpacity
              }
            ),
            this.getIconShape()
          ]
        )
      }
    }
    class Model extends PolygonNodeModel {

      constructor(data, graphModel) {
        data.text = {
          value: (data.text && data.text.value) || '',
          x: data.x,
          y: data.y + 50
        }
        super(data, graphModel)
        const lenght = 25
        this.points = [
          [lenght, 0],
          [lenght * 2, lenght],
          [lenght, lenght * 2],
          [0, lenght]
        ]
      }

      // getNodeStyle() {
      //   const style = super.getNodeStyle()
      //   style.stroke = "blue";
      //   style.strokeDasharray = "3 3";
      //   return style
      // }
    }
    return {
      view: Node,
      model: Model
    }
  })
}
